<template>
  <el-dialog :close-on-click-modal="false" append-to-body :visible.sync="visible" lock-scroll width="600px">
    <div class="block">
      <el-tree :data="data" node-key="id" :expand-on-click-node="false" accordion>
        <div class="custom-tree-node nodeSty" slot-scope="{ node, data }">
          <div>
            {{ data.name }}
          </div>
          <div v-if="data.systemId">
            <el-input-number @change="(value) => remove(value, node, data)" style="width: 150px" v-model="data.count" />
          </div>
        </div>

      </el-tree>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" @click="submitBind">确定</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { getDeviceTree, bindDevice, floorInfo } from "@/api/system/building";
export default {
  props: {
    buildingId: {
      type: Number,
      default: 0,
    },
    floorIds: {
      type: Array,
      default: () => {
        return [];
      },
    },
  },
  data() {
    return {
      visible: false,
      detailVisible: false,
      loading: false,

      data: [],
      devices: [],
      ids: [],
      floorList: []
    };
  },
  computed: {},
  watch: {},
  created() { },
  mounted() { },
  methods: {
    init(id) {
      this.visible = true;
      this.devices = [];
      this.$nextTick(() => {
        this.loading = true;
        getDeviceTree().then((res) => {
          this.data = res.data;
          this.loading = false;
        });
        floorInfo(this.floorIds[0]).then(res => {
          this.floorList = res.data
          this.devices = res.data
          this.mapList()
        })
      });
    },
    remove(value, node, data) {
      if (this.devices.length < 1) {
        this.devices.push({
          count: value,
          deviceId: data.id,
        });
      } else {
        let existingDeviceIndex = this.devices.findIndex(
          (device) => device.deviceId == data.id
        );
        if (existingDeviceIndex !== -1) {
          // 如果设备已存在，则更新count的值
          this.devices[existingDeviceIndex].count = value;
        } else {
          // 如果设备不存在，则新增设备
          this.devices.push({
            count: value,
            deviceId: data.id,
          });
        }
      }
    },
    submitBind() {
      bindDevice({
        buildingId: this.buildingId,
        devices: this.devices,
        floorIds: this.floorIds,
      }).then((res) => {
        this.visible = false;
        this.$modal.msgSuccess(res.msg);
        this.$emit("refreshDev", true);
      });
    },

    // 循环合并数组
    mapList() {
      for (let i = 0; i < this.data.length; i++) {
        if (this.data[i].children) {
          let childrenList = this.data[i].children
          for (let k = 0; k < this.floorList.length; k++) {
            for (let j = 0; j < childrenList.length; j++) {
              if (this.floorList[k].deviceId == childrenList[j].id) {
                childrenList[j].count = this.floorList[k].count
                // this.data[i].flag = this.floorList[k].count
              }
            }
          }

        }
      }
      console.log(this.data, '>>>555');
    }
  },
};
</script>
<style lang="scss" scoped>
.nodeSty {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
}
</style>
